<!DOCTYPE HTML>
<html>
<head>
<title>Hist&ograve;ries de Barcelona</title>

<meta name="viewport" content="width=device-width, initial-scale=1"> 
<script type="text/javascript" src="phonegap.js"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
  function initialize() {
    var latlng = new google.maps.LatLng(41.402481, 2.19233);
    var myOptions = {
      zoom: 17,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
	var marker = new google.maps.Marker({
		  position: latlng, 
		  map: map, 
		  title:"Historia del AppJam"
	}); 
	latlng = new google.maps.LatLng(41.403406, 2.189535);
	var marker = new google.maps.Marker({
		  position: latlng, 
		  map: map, 
		  title:"Historia Torre Agbar"
	}); 
	latlng = new google.maps.LatLng(41.403096, 2.194889);
	var marker = new google.maps.Marker({
		  position: latlng, 
		  map: map, 
		  title:"Historia Residencia Aidar"
	}); 
	latlng = new google.maps.LatLng(41.401374, 2.186311);
	var marker = new google.maps.Marker({
		  position: latlng, 
		  map: map, 
		  title:"Historia Jardi del bosquet dels encants"
	}); 
  }
	 
</script>
</head>
<body>

	<body onload="initialize()"> 
	<div data-role="page" id="home"> 
	<div data-role="header">
			<img src="header.png">
	</div>
	
		<a href="index.html" data-icon="home" class="ui-btn-left">Inici</a>
		
			<div data-role="content">	
				<div class="ui-bar-c ui-corner-all ui-shadow" style="padding:1em;">
  <div id="map_canvas" style="width:100%; height:100%"></div>

				</div>
			</div>
		</div>
		
	</body>
	
</html>